﻿<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title></title>
    <style>
        html, body {
            border: 0px;
            margin: 0px;
            height: 100%;
            font-family: 'Segoe UI Web Light', 'Segoe UI Light', 'Segoe WP Light', 'Segoe UI', 'Segoe WP', Tahoma, Arial, sans-serif;
            overflow: hidden;
        }

        #reportContainer {
            width: 100%;
            height: 100%;
            overflow:hidden;
        }

            #reportContainer iframe {
                border:0;
            }
    </style>
    <script src="powerbi.min.js"></script>
    <script>
        window.onload = function () {
            const models = window['powerbi-client'].models;
            const storage = window.localStorage;
            const token = storage.accessToken;
            const embedUrl = storage.embedUrl;
            const reportId = storage.reportId;
            const pageName = storage.pageName;
            const viewType = storage.viewType;
            const showFilterPane = storage.showFilterPane == "true"? true : false;
            let settings = {};

            if (token && embedUrl && reportId && pageName && viewType) {
                switch (viewType) {
                    case "MobilePortrait":
                        settings = {
                            layoutType: models.LayoutType.MobilePortrait
                        };
                        break;
                    case "MobileLandscape":
                        settings = {
                            layoutType: models.LayoutType.MobileLandscape
                        };
                        break;
                    case "Desktop":
                        settings = {
                            filterPaneEnabled: showFilterPane,
                            navContentPaneEnabled: false
                        };
                        break;
                }

                const config = {
                    type: 'report',
                    tokenType: models.TokenType.Aad,
                    accessToken: token,
                    embedUrl: embedUrl,
                    id: reportId,
                    permissions: models.Permissions.Read,
                    pageName: pageName,
                    settings: settings
                };

                powerbi.embed(document.getElementById('reportContainer'), config);

                storage.pageName = "";
                storage.viewType = "";
            }
        }
    </script>
</head>
<body>
    <div id="reportContainer">
    </div>
</body>
</html>